<template>
  <div>
    <Form ref="formItems" :model="formItems" :rules="formRules" :label-width="120" inline>

      <Row>
        <Col span="24">
          <Form-item label="代码输出方式" prop="outputType" style="width: 95%">
            <dict-radio v-model="formItems.outputType" :disabled="disableInput"
                        :kind="this.constants.dicts.dictKinds.OUTPUT_TYPE_DICT"></dict-radio>
          </Form-item>
        </Col>

        <Col span="24" v-show="formItems.outputType ==='1'">
          <Form-item label="代码输出根目录" prop="projectOutputDir" style="width: 95%">
            <file-chooser v-model="formItems.projectOutputDir" :disabled="disableInput"
                          dialogType="directory" changeCurPath="1"></file-chooser>
          </Form-item>
        </Col>
      </Row>

      <Row>
        <Col span="24">
          <Form-item label="模板类型" prop="templateType" style="width: 95%">
            <dict-radio v-model="formItems.templateType" :disabled="disableInput"
                        :kind="this.constants.dicts.dictKinds.TEMPLATE_TYPE_DICT"></dict-radio>
          </Form-item>
        </Col>
      </Row>


      <div v-show="formItems.templateType=='git'" style="margin-bottom: 20px">
        <Form-item label="git url" prop="gitUrl" style="width: 95%">
          <Input v-model="formItems.gitUrl" :maxlength="200" :disabled="disableInput">
          <Button slot="append" icon="ios-search" @click="repoChoose">选择</Button>
          </Input>

          <git-repo-list @itemChoose="chooseGitRepo" repoName="templateRepo" ref="gitRepoList"
                         :showButton="false"></git-repo-list>
        </Form-item>

        <Form-item label="branchName" prop="branchName" style="width: 95%">
          <Input v-model="formItems.branchName" :maxlength="200" :disabled="disableInput"></Input>
        </Form-item>

        <Form-item label="模板相对路径" prop="templateRelativePath" style="width: 95%">
          <Input v-model="formItems.templateRelativePath" :maxlength="200"
                 :disabled="disableInput"></Input>
        </Form-item>


        <Collapse simple>
          <Panel name="1">
            git鉴权&other
            <p slot="content">


              <Form-item label="用户名" prop="userName" style="width: 95%">
                <Input v-model="formItems.userName" :maxlength="200" :disabled="disableInput"></Input>
              </Form-item>

              <Form-item label="密码" prop="password" style="width: 95%">
                <Input type="password" v-model="formItems.password" :maxlength="200"
                       :disabled="disableInput"></Input>
              </Form-item>
            </p>
          </Panel>
        </Collapse>
      </div>

      <div v-show="formItems.templateType=='local' || formItems.templateType==null ">
        <Row>
          <Col span="24">
            <Form-item label="模板根目录" prop="templateBaseDir" style="width: 95%">
              <file-chooser v-model="formItems.templateBaseDir" :disabled="disableInput" changeCurPath="1"
                            dialogType="directory"></file-chooser>
            </Form-item>
          </Col>
        </Row>
      </div>

      <FormItem>
        <Button type="primary" @click="save" :loading="loading">
          <Icon type="md-checkmark"></Icon>
          Save
        </Button>

        <Button type="info" @click="fetchGitRepo" :loading="loading" v-show="formItems.templateType=='git'">
          <Icon type="md-arrow-down"></Icon>
          拉取git仓库
        </Button>
      </FormItem>
    </Form>

  </div>
</template>

<script>
  import constants from '@/constants/constants'
  import dictSelect from '@/view/components/dict/DictSelect'
  import fileChooser from '@/view/common/file/fileChooser'
  import requestUtils from '@/request/requestUtils.js'
  import dictRadio from '@/view/components/dict/DictRadio'
  import gitRepoList from '@/view/repos/git/list'

  var _ = require('underscore')

  var defConfig = {
    outputType: '2',
    templateBaseDir: '',
    projectOutputDir: '',
    templateType: 'git',
    'gitUrl': '',
    'branchName': 'master',
    'templateRelativePath': '',
    'userName': '',
    'password': ''
  }

  export default {
    props: {
      defaultProjectKey: {
        type: String
      },
      configKey: {
        type: String,
        default: 'pathConfig'
      },
      configInfo: {
        type: Object
      }
    },
    data: function () {
      let formRules = {
        templateBaseDir: [{ type: 'string', required: true, message: '模板根目录不能为空', trigger: 'blur' }],
        projectOutputDir: [{ type: 'string', required: true, message: '代码输出目录不能为空', trigger: 'blur' }],
        gitUrl: [{ type: 'string', required: false, message: 'gitUrl不能为空', trigger: 'blur' }],
        branchName: [{ type: 'string', required: false, message: 'branchName不能为空', trigger: 'blur' }]
      }
      let formItems = this.configInfo
      if (_.isEmpty(formItems)) {
        formItems = _.clone(defConfig)
      }
      return {
        projectKey: this.defaultProjectKey,
        formItems,
        formRules: formRules,
        constants,
        disableInput: false,
        loading: false
      }
    },
    watch: {
      'formItems.templateType': function (newVal) {
        this._templateTypeChange()
      },
      'formItems.outputType': function (newVal) {
        this._outputTypeChange()
      }
    },
    computed: {
      windowName: function () {
        let windowName = this.$store.state.autoCode.profile['browserWindowName']
        if (windowName === 'headless') {
          this.formRules.projectOutputDir[0].required = false
        }
        return windowName
      }
    },
    methods: {
      save: function () {
        if (!this.projectKey) {
          this.$Message.error({
            content: '您还没有选择项目',
            duration: 3
          })
          return
        }
        this.$refs['formItems'].validate((valid) => {
          if (!valid) {
            this.$Message.error({
              content: '参数验证失败，请检验参数',
              duration: 3
            })
            return false
          }
          requestUtils.postSubmit(this, constants.urls.conf.acConfig.save, this.getConfigData(), function (data) {
            this.$Message.success({
              content: '保存配置成功',
              duration: 3
            })
          }, null, true)
        })
      },
      getConfigData () {
        return {
          projectKey: this.projectKey,
          configKey: this.configKey,
          configValue: JSON.stringify(this.formItems),
          type: 2,
          scope: 1
        }
      },
      notifyConfigInfo (projectKey, configInfo) {
        this.projectKey = projectKey
        if (_.isEmpty(configInfo)) {
          this.formItems = _.clone(defConfig)
        } else {
          if (!configInfo.templateType) {
            configInfo.templateType = 'git'
          }
          if (!configInfo.outputType) {
            configInfo.outputType = '2'
          }
          this.formItems = configInfo
        }
        this._templateTypeChange()
        this._outputTypeChange()
      },
      fetchGitRepo () {
        this.$refs['formItems'].validate((valid) => {
          if (!valid) {
            this.$Message.error({
              content: '参数验证失败，请检验参数',
              duration: 3
            })
            return false
          }
          let gitRepoParam = {
            'gitUrl': this.formItems.gitUrl,
            'branchName': this.formItems.branchName,
            'userName': this.formItems.userName,
            'password': this.formItems.password
          }
          requestUtils.postSubmit(this, constants.urls.repo.git.fetchRepo, gitRepoParam, function (data) {
            this.$Message.success({
              content: '拉取仓库地址信息成功，耗时(s)：' + data['costTime'],
              duration: 5
            })
          }, null, true)
        })
      },
      _templateTypeChange: function () {
        let isGit = this.formItems.templateType === 'git'
        this.formRules.gitUrl[0].required = isGit
        this.formRules.branchName[0].required = isGit
        this.formRules.templateBaseDir[0].required = !isGit
      },
      _outputTypeChange: function () {
        this.formRules.projectOutputDir[0].required = (this.formItems.outputType === '1')
      },
      chooseGitRepo (gitRepo) {
        let _this = this
        this.$nextTick(() => {
          _this.formItems.gitUrl = gitRepo.gitUrl
          _this.formItems.branchName = gitRepo.branchName
          _this.formItems.templateRelativePath = gitRepo.templateRelativePath
        })
      },
      repoChoose () {
        this.$refs.gitRepoList.open()
      }
    },
    components: {
      dictSelect,
      fileChooser,
      dictRadio,
      gitRepoList
    }
  }
</script>
